<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/vue/vue.global.js"></script>
	</head>
	<body>
		<div id="app" v-if="isShow">
			<h2>{{sum}}</h2>
			<button @click="changeSum()">改变sum的值</button>
			<button @click="changeAppShow()">卸载app</button>
		</div>
	</body>
	<script>
	var app=new Vue({
		el:"#app",
		data:{
			sum:0,
			isShow:true
		},
		methods:{
			changeSum:function(){
				this.sum+=1
			},
			changeAppShow:function(){
				this.isShow=false
			}
		},
		beforeCreate() {
			console.log("执行了。。。beforeCreate")
		},
		created() {
			console.log("执行了。。。created")
		}, 
		beforeMount() {
			console.log("执行了。。。beforeMount")
			
		},
		mounted() {
			console.log("执行了。。。mounted")
		},
		beforeUpdate() {
			console.log("执行了。。。beforeUpdate")
		},
		updated() {
			console.log("执行了。。。updated")
		},
		beforeDestroy() {
			console.log("执行了。。。beforeDestroy")
		},
		destroyed() {
			console.log("执行了destroyed")
		}
	})
	</script>
</html>
